<template>
	<view>
		<view class="invitetitle">
			<view class="invitetitle-em"></view>
			<view class="invitetitle-text">员工列表</view>
		</view>

		<block v-for="(item, index) in staff_list_data" :key="index">
			<view @click="invitelist(index)" class="d-flex a-center mt-1 line-h-md">
				<view class="flex-5">
					<view><span style="color: #777;">姓名：</span>{{item.name}}</view>
					<view><span style="color: #777;">电话：</span>{{item.tel}}</view>
				</view>

				<view class="d-flex flex-2">
					<view class="inite">邀约</view>
					<view class="inite-count">{{item.invite_count}}</view>
				</view>

				<view class="flex-2" :class="item.status == 0 ? 'no-pass' : 'pass'">
					{{item.status ? '已通过' : '待审核'}}
				</view>
			</view>
			
			<divider />
		</block>
		
		<uni-load-more :status="status" style="margin-bottom: 100rpx;"/>
		
	</view>
</template>

<script>
	import uniLoadMore from '../../components/common/uni-load-more.vue'

	export default {
		components: {
			uniLoadMore,
		},
		props: {
			status: null,
			staff_list_data: null,
			activity_id: null,
		},
		methods: {
			//获取员工邀约列表
			invitelist(index) {
				this.staff_id = this.staff_list_data[index].id
				this.staff_name = this.staff_list_data[index].name
				// console.log(this.staff_id, this.staff_name)
				uni.navigateTo({
					url: 'admin_staff?staff_id=' + this.staff_id + '&staff_name=' + this.staff_name + '&activity_id=' + this.activity_id
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	@import '@/common/main.css';
	@import  '@/common/zcm-main.css';
	
	page {
		color: #000;
	}
	.invitetitle {
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 30rpx 0 10rpx 0;
		
		.invitetitle-em {
			height: 35rpx;
			width: 10rpx;
			background-color: #475dfc;
			border-radius: 50rpx;
		}

		.invitetitle-text {
			font-weight: bold;
			margin-left: 10rpx;
		}
	}

	.inite {
		font-size: 26rpx;
		color: #ffffff;
		width: 70rpx;
		// height: 40rpx;
		// line-height: 1.7;
		text-align: right;
		padding: 5rpx;
		background-color: #475dfc;
		border-radius: 50rpx 0rpx 0rpx 50rpx;
	}
	
	.inite-count {
		font-size: 26rpx;
		width: 70rpx;
		padding: 5rpx;
		color: #475dfc;
		text-align: center;
		border: solid 1rpx #475dfc;
		border-radius: 0rpx 50rpx 50rpx 0rpx;
	}

	@mixin pass1 {
		width: 100rpx;
		margin-left: 50rpx;
		font-size: 25rpx;
		color: #ffffff;
		padding: 6rpx;
		text-align: center;
		border-radius: 50rpx;
	}

	.no-pass {
		@include pass1;
		background-color: #A40000;
	}

	.pass {
		@include pass1;
		background-color: #5fb256;
	}
</style>
